$(function () {
    $(document).ready(function () {
        Highcharts.setOptions({
            global: {
                useUTC: false
            }
        });
        var interval = 60;
        var start = -(interval * 60);
        var end = -60;
        var currCluster = "object-hbase";
        var currServer = "10.75.21.46";
        $('h3').text(currCluster + " > " + currServer);

        registServerMenu();

        drawCharts("sys_tab", start, end, interval, 1, {"host":currServer,"cluster":currCluster});

        $("#tabs1 a").click(function () {
            currTab = $(this).attr("value");
            initTableDiv();
            if (currTab == "table_tab") {
                $.each(table_config[currCluster], function(idx, table){
                   drawTableCharts(currTab, table, start, end, interval, 1, {"host":currServer,"cluster":currCluster});
                });
            } else {
                drawCharts(currTab, start, end, interval, 1, {"host":currServer,"cluster":currCluster});
            }
        });

        $('#startTime').datetimepicker({
            autoclose: true,
            todayBtn: true,
            format: 'yyyy-mm-dd hh:ii:ss',
            language: 'zh-CN'
        });
        $('#endTime').datetimepicker({
            autoclose: true,
            todayBtn: true,
            format: 'yyyy-mm-dd hh:ii:ss',
            language: 'zh-CN'
        });
        $('#last button').click(function () {
            var multiple = this.value;
            var interval = 60 * multiple;
            var startTime = -(60 * 60 * multiple);
            if (currTab == "table_tab") {
                $.each(table_config[currCluster], function(idx, table){
                    drawTableCharts(currTab, table, startTime, end, interval, multiple, {"host":currServer,"cluster":currCluster});
                });
            } else {
                drawCharts(currTab, startTime, end, interval, multiple, {"host":currServer,"cluster":currCluster});
            }
        });
        // 按指定时间范围查询
        $('#go').click(function () {
            var startStr = $('#startTime').val();
            var endStr = $('#endTime').val();
            if (startStr == "") {
                return;
            }
            var startTime = new Date(startStr).getTime() / 1000;
            var endTime = -60;
            if (endStr != "") {
                endTime = new Date(endStr).getTime() / 1000;
            }
            var diff = 0;
            if (endTime < 0) {
                diff = new Date().getTime() / 1000 - startTime;
            } else {
                diff = endTime - startTime;
            }
            if (diff <= 0) {
                return;
            }
            var multiple = parseInt(diff / (60 * 60));
            drawCharts(currTab, startTime, endTime, 60 * multiple, multiple, {"host":currServer,"cluster":currCluster});
        });
        // 清空时间控件
        $('#clear').click(function () {
            $('input[type="text"]').val("");
        });

        $('#select_cluster_menu>li').click(function(){
            currCluster = $(this).text();
            currServer = server_config[currCluster][0];
            $('#select_cluster_btn').html(currCluster).append("<span class=\"caret\"></span>");
            $('#select_server_btn').html(currServer).append("<span class=\"caret\"></span>");
            $('h3').text(currCluster + " > " + currServer);
            $('#select_server_menu').empty();
            var html = ""
            $.each(server_config[currCluster], function(idx, s){
                html += "<li><a href=\"#\"></a>" + s + "</li>";
            });
            $('#select_server_menu').html(html);
            registServerMenu();
            initTableDiv();
            if (currTab == "table_tab") {
                $.each(table_config[currCluster], function(idx, table){
                    drawTableCharts(currTab, table, start, end, interval, 1, {"host":currServer,"cluster":currCluster});
                });
            } else {
                drawCharts(currTab, start, end, interval, 1, {"host":currServer,"cluster":currCluster});
            }
        });

        function registServerMenu() {
            $('#select_server_menu>li').click(function(){
                currServer = $(this).text();
                $('#select_server_btn').html(currServer).append("<span class=\"caret\"></span>");
                $('h3').text(currCluster + " > " + currServer);
                if (currTab == "table_tab") {
                    $.each(table_config[currCluster], function(idx, table){
                        drawTableCharts(currTab, table, start, end, interval, 1, {"host":currServer,"cluster":currCluster});
                    });
                } else {
                    drawCharts(currTab, start, end, 60 * 1, 1, {"host":currServer,"cluster":currCluster});
                }
            });
        }

        function initTableDiv() {
            $('#tabs-5').empty();
            var tables = table_config[currCluster];
            var html = "<div class='container-fluid'>";
            $.each(tables, function(idx, table){
                if (table == "META" || table == "-ROOT-") {
                    return;
                }
                html += "<div class='row-fluid' style='margin-top: 0px'>";
                html += "   <div class='span6'>";
                html += "       <div id='" + table + "__numOps'></div>";
                html += "   </div>"
                html += "   <div class='span6'>";
                html += "       <div id='" + table + "__avgTime'></div>";
                html += "   </div>";
                html += "</div>"
            });
            html += "</div>"
            $('#tabs-5').html(html);
        }
    });
});